<template>
    <view class="detail-item">
        <image
            v-if="!getAppSet().isHideImg"
            class="item-img"
            mode="aspectFill"
            :src="easyGetImgUrl(item.ThumbnailUrl160)"></image>
        <view class="right">
            <view class="css-name">{{ item.ProductName }}</view>
            <p class="css-oprice">原价￥{{ item.RetailMaxPrice }}</p>
            <view class="css-bottom">
                <view>
                    <text>到手价</text>
                    <text class="unit">￥</text>
                    <text class="css-currentPrice">{{ item.V_GradePrice }}</text>
                </view>
                <button class="btn btn-activity" @click="goDetail">立即抢购</button>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    props: {
        item: {
            type: Object,
            default: {},
        },
		sales:{
			type:Number,
			default:0
		}
    },
    data() {
        return {}
    },
    mounted() {},
    methods: {
        goDetail() {
			if(this.sales==1){
				this.easyGoTo("/pages_shop/packet/product/productDetail?id=" + this.item.ID+'&InfoType=1')
			}else{
				this.easyGoTo("/pages_shop/packet/product/seckillDetail?id=" + this.item.ActivityDetailId)
			}
        },
    },
}
</script>

<style lang="scss">
.detail-item {
    display: flex;
    margin-top: 30rpx;
    image {
        width: 212rpx;
        height: 212rpx;
        border-radius: 16rpx;
        margin-right: 22rpx;
    }
    .right {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }
    .css-name {
        font-size: $font-size-28;
        font-weight: 700;
        white-space: wrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .css-oprice {
        font-size: $font-size-24;
        color: $app-color-text-tip;
        margin-top: 60rpx;
        // margin-bottom: 10rpx;
    }
    .css-bottom {
        display: flex;
        justify-content: space-between;
        .unit {
            color: #ec612a;
            font-size: 20rpx;
        }
        .css-currentPrice {
            color: #ec612a;
            font-size: 34rpx;
            font-weight: bold;
        }
        .btn {
            border-radius: 32rpx;
            height: 56rpx;
            width: 160rpx;
            font-size: 28rpx;
            margin-right: 0rpx;
            margin-top: -10rpx;
        }
    }
}
</style>
